﻿<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
        
        <title>Alright Animation Editor</title>

        <link rel="stylesheet" type="text/css" href="./easyui/themes/default/easyui.css">
        <link rel="stylesheet" type="text/css" href="./easyui/themes/icon.css">
        <link rel="stylesheet" type="text/css" href="./editor.css">
    </head>
    <body class="easyui-layout">
        <div region="north" split="false" border="true" style="height:36px;padding:4px;">
            <div style="background:#C9EDCC;padding:0px;width:600px;">
                <a href="javascript:void(0)" id="mb1" class="easyui-menubutton" menu="#mm1" iconCls="icon-edit">Edit</a>
                <a href="javascript:void(0)" id="mb2" class="easyui-menubutton" menu="#mm2" iconCls="icon-help">Help</a>
            </div>
            <div id="mm1" style="width:150px;">
                <div iconCls="icon-undo">Undo</div>
                <div iconCls="icon-redo">Redo</div>
                <div class="menu-sep"></div>
                <div>Cut</div>
                <div>Copy</div>
                <div>Paste</div>
                <div class="menu-sep"></div>
                <div>
                    <span>Toolbar</span>
                    <div style="width:150px;">
                        <div>Address</div>
                        <div>Link</div>
                        <div>Navigation Toolbar</div>
                        <div>Bookmark Toolbar</div>
                        <div class="menu-sep"></div>
                        <div>New Toolbar...</div>
                    </div>
                </div>
                <div iconCls="icon-remove">Delete</div>
                <div>Select All</div>
            </div>
            <div id="mm2" style="width:100px;">
                <div>Help</div>
                <div>Update</div>
                <div>About</div>
            </div>
        </div>
        <div region="south" title="South Title" split="true" style="height:100px;padding:10px;background:#efefef;">
            <div class="easyui-layout" fit="true" style="background:#ccc;">
                <div region="center">sub center</div>
                <div region="east" split="true" style="width:200px;">sub center</div>
            </div>
        </div>
        <div region="east" iconCls="icon-reload" title="Tree Menu" split="true" style="width:180px;">
            <ul class="easyui-tree" url="tree_data.json"></ul>
        </div>
        <div region="west" split="true" title="West Menu" style="width:280px;padding1:1px;overflow:hidden;">
            <div class="easyui-accordion" fit="true" border="false">
                <div title="Title1" style="padding:10px;overflow:auto;">
                    <p>content1</p>
                    <p>content1</p>
                    <p>content1</p>
                    <p>content1</p>
                    <p>content1</p>
                    <p>content1</p>
                    <p>content1</p>
                    <p>content12</p>
                </div>
                <div title="Title2" selected="true" style="padding:10px;">
                    content2
                </div>
                <div title="Title3" style="padding:10px">
                    content3
                </div>
            </div>
        </div>
        <div region="center" style="overflow:hidden;">
            <div class="easyui-tabs" fit="true" border="false">
                <div title="Tab1" iconCls="icon-reload" closable="true" style="overflow:hidden;padding:5px;"> 
                    <canvas id="game-screen" width="800px" height="600px"></canvas>
                </div>
            </div>
        </div>
        
        <script type="text/javascript" charset="utf-8" src="./easyui/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" charset="utf-8" src="./easyui/jquery.easyui.min.js"></script>

        <script type="text/javascript" charset="utf-8" src="../js/references/glMatrix-0.9.5.min.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/base.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/start.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/start-web.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/asset.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/graphics-web.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/audio-web.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/game.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/spatialtree.js"></script>
        <script type="text/javascript" charset="utf-8" src="../js/rendertree.js"></script>

        <script type="text/javascript" charset="utf-8" src="./editor-animation.js"></script>
        
        <script id="geometry-vs" type="text/plain" charset="utf-8">
            attribute vec3 VertexPosition;
            attribute vec2 VertexTexture;

            uniform mat4 World;
            uniform mat4 Projection;
            
            varying vec2 VVertexTexture;

            void main(void)
            {
                gl_Position = Projection * World * vec4(VertexPosition, 1.0);
                VVertexTexture = VertexTexture;
            }
        </script>
        <script id="geometry-fs" type="text/plain" charset="utf-8">
            precision mediump float;
           
            uniform sampler2D Sampler;
            varying vec2 VVertexTexture;

            void main(void)
            {
                gl_FragColor = texture2D(Sampler, VVertexTexture);// vec4(1.0, 0.0, 0.0, 1.0);
            }
        </script>
    </body>
</html>